<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!doctype html>
<html lang="zh">
	<style>
		/* 基础样式重置 */
		* {
			box-sizing: border-box;
			margin: 0;
			padding: 0;
		}
		
		/* 容器样式 */
		.glass-container {
			max-width: 800px;
			margin: 2rem auto;
			background: rgba(255, 255, 255, 0.95);
			backdrop-filter: blur(12px);
			border-radius: 24px;
			box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
			padding: 3rem;
			border: 1px solid rgba(255, 255, 255, 0.3);
		}
		
		/* 头部样式 */
		.form-header {
			text-align: center;
			margin-bottom: 3rem;
		}
		.header-icon {
			width: 80px;
			height: 80px;
			background: linear-gradient(135deg, #6366f1, #8b5cf6);
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0 auto 1.5rem;
		}
		.header-icon i {
			color: white;
			font-size: 2.5rem;
		}
		.form-header h2 {
			color: #1e293b;
			font-size: 2rem;
			margin-bottom: 0.5rem;
		}
		.form-header p {
			color: #64748b;
			font-size: 0.9rem;
		}
		
		/* 输入组样式 */
		.form-grid {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 2rem;
		}
		.input-group {
			position: relative;
			margin-bottom: 1.5rem;
		}
		
		.icon {
			position: absolute;
			left: 1rem;
			top: 50%;
			transform: translateY(-50%);
			color: #6366f1;
			z-index: 2;
			font-size: 1.2rem;
		}
		
		input, select {
			width: 100%;
			height: 56px;
			padding: 1rem 1rem 1rem 3rem;
			border: 2px solid #e2e8f0;
			border-radius: 12px;
			font-size: 1rem;
			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
			background: rgba(255, 255, 255, 0.8);
		}
		
		input:focus, select:focus {
			outline: none;
			border-color: #6366f1;
			box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
		}
		
		label {
			position: absolute;
			left: 3rem;
			top: 50%;
			transform: translateY(-50%);
			color: #64748b;
			pointer-events: none;
			transition: all 0.3s ease;
		}
		
		input:focus ~ label,
		input:not(:placeholder-shown) ~ label,
		select:valid ~ label {
			top: -10px;
			left: 1rem;
			font-size: 0.8rem;
			color: #6366f1;
			background: white;
			padding: 0 0.5rem;
		}
		
		.input-hint {
			display: block;
			color: #94a3b8;
			font-size: 0.8rem;
			margin-top: 0.5rem;
			padding-left: 3rem;
		}
		
		/* 下拉选择样式 */
		.status-select {
			position: relative;
		}
		.status-select select {
			appearance: none;
			padding-right: 2.5rem;
		}
		.status-select::after {
			content: "⌄";
			position: absolute;
			right: 1rem;
			top: 50%;
			transform: translateY(-50%);
			color: #64748b;
			font-size: 1.2rem;
			pointer-events: none;
		}
		
		/* 提交按钮 */
		.submit-btn {
			position: relative;
			width: 100%;
			padding: 1.2rem;
			background: linear-gradient(135deg, #6366f1, #8b5cf6);
			color: white;
			border: none;
			border-radius: 12px;
			font-size: 1.1rem;
			font-weight: 500;
			cursor: pointer;
			overflow: hidden;
			transition: transform 0.3s ease;
			margin-top: 2rem;
		}
		
		.submit-btn i {
			margin-right: 0.8rem;
		}
		
		.hover-effect {
			position: absolute;
			top: 0;
			left: -100%;
			width: 100%;
			height: 100%;
			background: linear-gradient(
				90deg,
				transparent,
				rgba(255, 255, 255, 0.2),
				transparent
			);
			transition: left 0.6s;
		}
		
		.submit-btn:hover .hover-effect {
			left: 100%;
		}
		
		.submit-btn:active {
			transform: scale(0.98);
		}
		
		/* 响应式设计 */
		@media (max-width: 768px) {
			.glass-container {
				margin: 1rem;
				padding: 2rem;
			}
			.form-grid {
				grid-template-columns: 1fr;
			}
			input, select {
				padding-left: 2.8rem;
			}
			label {
				left: 2.8rem;
			}
		}
		</style>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<meta name="description" content="通辽航空管理平台 ">
		<title>通辽航空管理平台 </title>
		<link rel="stylesheet" href="css/bootstrap.min.css">
		<link rel="stylesheet" href="fonts/style.css">
		<link rel="stylesheet" href="css/main.css">
		<link rel="stylesheet" href="css/css.css">
	</head>
	<body>
		<header class="header">
			<div class="container-fluid">
				<div class="row gutters">
					<div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-9">
						<a href="index.html" class="logo"> <img src="img/logo.png">通辽航空管理平台  </a>
					</div>
					<div class="col-xl-8 col-lg-8 col-md-8 col-sm-8 col-3">
						<ul class="header-actions">
							<li class="dropdown d-none d-sm-block">
								<a href="#" id="notifications" data-toggle="dropdown" aria-haspopup="true">
									<i class="icon-bell"></i>
									<span class="count-label"></span>
								</a>
								<div class="dropdown-menu lrg" aria-labelledby="notifications">
									<div class="dropdown-menu-header">
										<h5>Notifications</h5>
										<p class="m-0 sub-title">You have 5 unread notifications</p>
									</div>	
								</div>
							</li>
							<li class="dropdown">
								<a href="#" id="userSettings" class="user-settings" data-toggle="dropdown" aria-haspopup="true">
									<span class="user-name">管理员</span>
									<span class="avatar">NR<span class="status busy"></span></span>
								</a>
								<div class="dropdown-menu dropdown-menu-right" aria-labelledby="userSettings">
									<div class="header-profile-actions">
										<div class="header-user-profile">
										
											<h5>管理员</h5>
											<p>Admin</p>
										</div>
										<a href="hospital-add-doctor.html"><i class="icon-user1"></i> My Profile</a>
										<a href="account-settings.html"><i class="icon-settings1"></i> Account Settings</a>
										<a href="hospital-reviews.html"><i class="icon-activity"></i> Activity Logs</a>
										<a href="login.html"><i class="icon-log-out1"></i> Sign Out</a>
									</div>
								</div>
							</li>
						</ul>						
					</div>
				</div>
			</div>
		</header>
		<div class="container-fluid">


			<!-- Navigation start -->
			<nav class="navbar navbar-expand-lg custom-navbar">
				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#royalHospitalsNavbar" aria-controls="royalHospitalsNavbar" aria-expanded="false" aria-label="Toggle navigation">
					<span class="navbar-toggler-icon">
						<i></i>
						<i></i>
						<i></i>
					</span>
				</button>
				<div class="collapse navbar-collapse" id="royalHospitalsNavbar">
					<ul class="navbar-nav">
						<li class="nav-item">
							<a class="nav-link" href="FlightsServlet?pageNo=1">
								<i class="icon-home nav-icon"></i>
								首页</a>
						</li>
						<li class="nav-item dropdown">
							<a class="nav-link dropdown-toggle active-page" href="#" id="doctoRs" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="icon-person_pin nav-icon"></i>
								数据录入
							</a>
							<ul class="dropdown-menu" aria-labelledby="doctoRs">
								<li><a class="dropdown-item" href="flight_insert.jsp">录入航班</a></li>
								<li><a class="dropdown-item active-page" href="aircraft_insert.jsp">录入飞机</a></li>
							</ul>
						</li>
						<li class="nav-item dropdown">
							<a class="nav-link dropdown-toggle" href="#" id="formsDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="icon-assignment_turned_in nav-icon"></i>
								申请管理
							</a>
							<ul class="dropdown-menu" aria-labelledby="formsDropdown">
								<li><a class="dropdown-item " href="QuitsServlet?pageNo=1">退票申请列表</a></li>
								<li><a class="dropdown-item " href="AuditsServlet?pageNo=1">改签申请列表</a></li>
							</ul>
						</li>
						<li class="nav-item dropdown">
							<a class="nav-link dropdown-toggle " href="#" id="uiElementsDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="icon-assignment nav-icon"></i>
								数据管理
							</a>
							<ul class="dropdown-menu" aria-labelledby="uiElementsDropdown">
								<li><a class="dropdown-item" href="${pageContext.request.contextPath}/UserList?pageNo=1">用户数据管理</a></li>
								<li><a class="dropdown-item" href="${pageContext.request.contextPath}/AircraftListServlet?pageNo=1">飞机数据管理</a></li>

							</ul>
						</li>
						<li class="nav-item dropdown">
							<a class="nav-link dropdown-toggle" href="#" id="loginDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								<i class="icon-burst_mode nav-icon"></i>
								注册申请 
							</a>
							<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="loginDropdown">
								<li><a class="dropdown-item " href="RegisterListServlet?pageNo=1">用户注册申请</a></li>
							</ul>
						</li>
					</ul>
				</div>
			</nav>
		
			<div class="main-container">
				<div class="page-header">
					<ol class="breadcrumb">
						<li class="breadcrumb-item">评测管理</li>
						<li class="breadcrumb-item active">评测预约</li>
					</ol>
				</div>
				

				<div class="content-wrapper">
					<div class="glass-container">
						<!-- 头部 -->
						<div class="form-header">
							<div class="header-icon">
								<i class="fas fa-plane-departure"></i>
							</div>
							<h2>新飞机信息录入</h2>
							<p>请输入完整的飞机信息</p>
						</div>
				
						<!-- 表单主体 -->
						<form class="aircraft-form" action="AddAircraftServlet" method="post">
							<div class="form-grid">
								<!-- 飞机编号 -->
								<div class="input-group">
									<i class="icon fas fa-id-card"></i>
									<input type="text" 
										   name="aircraftId" 
										   placeholder=" "
										   pattern="[A-Za-z0-9-]{3,20}"
										   required>
									<label>飞机编号</label>
									<span class="input-hint">(例：B-1234)</span>
								</div>
				
								<!-- 飞机型号 -->
								<div class="input-group">
									<i class="icon fas fa-tags"></i>
									<input type="text" 
										   name="model" 
										   placeholder=" "
										   required>
									<label>飞机型号</label>
									<span class="input-hint">(例：波音737-800)</span>
								</div>
				
								<!-- 当前状态 -->
								<div class="input-group">
									<i class="icon fas fa-heartbeat"></i>
									<div class="status-select">
										<select name="currentStatus" required>
											<option value="" disabled selected></option>
											<option value="可用">🟢 可用</option>
											<option value="维修中">🟠 维修中</option>
											<option value="停飞">🔴 停飞</option>
										</select>
										<label>当前状态</label>
									</div>
								</div>
				
								<!-- 最大座位数 -->
								<div class="input-group">
									<i class="icon fas fa-chair"></i>
									<input type="number" 
										   name="maxSeats" 
										   placeholder=" "
										   min="1" 
										   max="1000" 
										   required>
									<label>最大座位</label>
									<span class="input-hint">(1-1000)</span>
								</div>
							</div>
				
							<!-- 提交按钮 -->
							<button type="submit" class="submit-btn">
								<i class="fas fa-paper-plane"></i>
								提交信息
								<div class="hover-effect"></div>
							</button>
						</form>
					</div>
				</div>
			</div>

			<footer class="main-footer"> 2025 © Copyright by <a href="https://www.bootstrapmb.com">bootstrapMB</a>-社区身心健康管理元平台 © 2025-2030</footer>

		</div>
		<script src="js/jquery.min.js"></script>
		<script src="js/bootstrap.bundle.min.js"></script>
		<script src="js/moment.js"></script>

		<script src="laydate/laydate.js" type="text/javascript"></script> 
		<script>
		lay('#version').html('-v'+ laydate.v);
		laydate.render({
			elem: '#date'
		 ,range: true
		  ,theme: '#13a98c'
		});
		</script>

	<script>
		// Bootstrap表单验证
		(function () {
		'use strict'
		const forms = document.querySelectorAll('.needs-validation')
		Array.from(forms).forEach(form => {
			form.addEventListener('submit', event => {
			if (!form.checkValidity()) {
				event.preventDefault()
				event.stopPropagation()
			}
			form.classList.add('was-validated')
			}, false)
		})
		})()
	</script>
		
	</body>
</html>